{
 "cells": [
  {
   "cell_type": "markdown",
   "metadata": {},
   "source": [
    "# 数组和对象的解构\n",
    "## 一．数组解构\n",
    "1. ES6 提供了对数组和对象的字面量提取相关数据的方法：解构操作；\n",
    "2. 为何要使用解构操作？是因为 JSON 格式的普及，导致大量数据提取工作；\n",
    "3. 而这种提取过程，在 ES6 的解构语法中，带来了极大的便捷性；\n",
    "4. 数组解构赋值，有两种基本的写法：1.分行解构；2.单行解构；"
   ]
  },
  {
   "cell_type": "code",
   "execution_count": null,
   "metadata": {
    "ExecuteTime": {
     "end_time": "2020-10-06T14:39:34.218941Z",
     "start_time": "2020-10-06T14:39:33.487Z"
    }
   },
   "outputs": [],
   "source": [
    "//1.分行解构\n",
    "let info = ['anlzou',20,'boy'];\n",
    "let [name,age,gender] = info;"
   ]
  },
  {
   "cell_type": "code",
   "execution_count": null,
   "metadata": {
    "ExecuteTime": {
     "end_time": "2020-10-06T14:39:34.225166Z",
     "start_time": "2020-10-06T14:39:33.492Z"
    }
   },
   "outputs": [],
   "source": [
    "// 2.单行解构\n",
    "let info2 = ['Mr.Lee', 100, '男'],\n",
    "[name2, age2, gender2] = info2;"
   ]
  },
  {
   "cell_type": "code",
   "execution_count": null,
   "metadata": {
    "ExecuteTime": {
     "end_time": "2020-10-06T14:39:34.233345Z",
     "start_time": "2020-10-06T14:39:33.496Z"
    }
   },
   "outputs": [],
   "source": [
    "//单行解构，以上均可输出 name 值\n",
    "let [name3, age3, gender3] = ['Mr.Lee', 100, '男'];\n",
    "console.log(name3);"
   ]
  },
  {
   "cell_type": "code",
   "execution_count": null,
   "metadata": {
    "ExecuteTime": {
     "end_time": "2020-10-06T14:39:34.241282Z",
     "start_time": "2020-10-06T14:39:33.501Z"
    }
   },
   "outputs": [],
   "source": [
    "console.log(name,age,gender);\n",
    "console.log(name2,age2,gender2);"
   ]
  },
  {
   "cell_type": "markdown",
   "metadata": {},
   "source": [
    "5. 从上面的例子分行或单行，都可以确定必须一一完美匹配才可以正确赋值；"
   ]
  },
  {
   "cell_type": "code",
   "execution_count": null,
   "metadata": {
    "ExecuteTime": {
     "end_time": "2020-10-06T14:39:34.252494Z",
     "start_time": "2020-10-06T14:39:33.507Z"
    }
   },
   "outputs": [],
   "source": [
    "//数组层次也需要匹配\n",
    "let [name4, [age4, gender4]] = ['Mr.Lee', [100, '男']];"
   ]
  },
  {
   "cell_type": "code",
   "execution_count": null,
   "metadata": {
    "ExecuteTime": {
     "end_time": "2020-10-06T14:39:34.253723Z",
     "start_time": "2020-10-06T14:39:33.511Z"
    }
   },
   "outputs": [],
   "source": [
    "//用逗号作为占位符不赋值\n",
    "let [,, gender5] = ['Mr.Lee', 100, '男'];"
   ]
  },
  {
   "cell_type": "code",
   "execution_count": null,
   "metadata": {
    "ExecuteTime": {
     "end_time": "2020-10-06T14:39:34.254813Z",
     "start_time": "2020-10-06T14:39:33.514Z"
    }
   },
   "outputs": [],
   "source": [
    "console.log(name4,age4,gender4);\n",
    "console.log(gender5)"
   ]
  },
  {
   "cell_type": "markdown",
   "metadata": {},
   "source": [
    "6. 在变量解构时，可以在数组的元素中设置一个默认值；"
   ]
  },
  {
   "cell_type": "code",
   "execution_count": null,
   "metadata": {
    "ExecuteTime": {
     "end_time": "2020-10-06T14:40:25.765261Z",
     "start_time": "2020-10-06T14:40:25.039Z"
    }
   },
   "outputs": [],
   "source": [
    "//当 gender 没有赋值时，采用默认值\n",
    "let [name6, age6, gender6 = '男'] = ['Mr.Lee', 100];"
   ]
  },
  {
   "cell_type": "code",
   "execution_count": null,
   "metadata": {
    "ExecuteTime": {
     "end_time": "2020-10-06T14:40:41.189429Z",
     "start_time": "2020-10-06T14:40:40.463Z"
    }
   },
   "outputs": [],
   "source": [
    "console.log(gender6)"
   ]
  },
  {
   "cell_type": "markdown",
   "metadata": {},
   "source": [
    "7. 还有一种...var 的语法，可以将没有赋值的内容都赋值给这个变量；"
   ]
  },
  {
   "cell_type": "code",
   "execution_count": null,
   "metadata": {
    "ExecuteTime": {
     "end_time": "2020-10-06T14:41:45.213586Z",
     "start_time": "2020-10-06T14:41:44.487Z"
    }
   },
   "outputs": [],
   "source": [
    "let[name7,...other] = ['Mr.Lee', 100, '男','软件工程'];"
   ]
  },
  {
   "cell_type": "code",
   "execution_count": null,
   "metadata": {
    "ExecuteTime": {
     "end_time": "2020-10-06T14:42:05.125141Z",
     "start_time": "2020-10-06T14:42:04.398Z"
    }
   },
   "outputs": [],
   "source": [
    "console.log(other[2])"
   ]
  },
  {
   "cell_type": "markdown",
   "metadata": {},
   "source": [
    "## 二．对象解构\n",
    "1. 对象的解构方式和数组大同小异，定义一个对象字面量，然后解构赋值；"
   ]
  },
  {
   "cell_type": "code",
   "execution_count": 1,
   "metadata": {
    "ExecuteTime": {
     "end_time": "2020-10-06T14:47:10.763015Z",
     "start_time": "2020-10-06T14:47:10.029Z"
    }
   },
   "outputs": [],
   "source": [
    "//定义对象字面量\n",
    "let obj = {\n",
    "    name:\"anlzou\",\n",
    "    age:20\n",
    "}"
   ]
  },
  {
   "cell_type": "code",
   "execution_count": 6,
   "metadata": {
    "ExecuteTime": {
     "end_time": "2020-10-06T14:49:53.208190Z",
     "start_time": "2020-10-06T14:49:52.477Z"
    }
   },
   "outputs": [
    {
     "ename": "SyntaxError",
     "evalue": "Identifier 'name8' has already been declared",
     "output_type": "error",
     "traceback": [
      "evalmachine.<anonymous>:1",
      "let {name8,age8} = obj;",
      "^",
      "",
      "SyntaxError: Identifier 'name8' has already been declared",
      "    at evalmachine.<anonymous>:1:1",
      "    at Script.runInThisContext (vm.js:131:20)",
      "    at Object.runInThisContext (vm.js:297:38)",
      "    at run ([eval]:1054:15)",
      "    at onRunRequest ([eval]:888:18)",
      "    at onMessage ([eval]:848:13)",
      "    at process.emit (events.js:315:20)",
      "    at emit (internal/child_process.js:881:12)",
      "    at processTicksAndRejections (internal/process/task_queues.js:85:21)"
     ]
    }
   ],
   "source": [
    "let {name8,age8} = obj;\n",
    "//or\n",
    "// ({name8,age8} = obj);"
   ]
  },
  {
   "cell_type": "code",
   "execution_count": 7,
   "metadata": {
    "ExecuteTime": {
     "end_time": "2020-10-06T14:49:56.913341Z",
     "start_time": "2020-10-06T14:49:56.183Z"
    }
   },
   "outputs": [
    {
     "name": "stdout",
     "output_type": "stream",
     "text": [
      "undefined\n",
      "undefined\n"
     ]
    }
   ],
   "source": [
    "//直接输出变量\n",
    "console.log(name8);\n",
    "console.log(age8);"
   ]
  },
  {
   "cell_type": "code",
   "execution_count": null,
   "metadata": {},
   "outputs": [],
   "source": []
  }
 ],
 "metadata": {
  "kernelspec": {
   "display_name": "Javascript (Node.js)",
   "language": "javascript",
   "name": "javascript"
  },
  "language_info": {
   "file_extension": ".js",
   "mimetype": "application/javascript",
   "name": "javascript",
   "version": "13.13.0"
  },
  "toc": {
   "base_numbering": 1,
   "nav_menu": {},
   "number_sections": true,
   "sideBar": true,
   "skip_h1_title": false,
   "title_cell": "Table of Contents",
   "title_sidebar": "Contents",
   "toc_cell": false,
   "toc_position": {},
   "toc_section_display": true,
   "toc_window_display": false
  },
  "varInspector": {
   "cols": {
    "lenName": 16,
    "lenType": 16,
    "lenVar": 40
   },
   "kernels_config": {
    "python": {
     "delete_cmd_postfix": "",
     "delete_cmd_prefix": "del ",
     "library": "var_list.py",
     "varRefreshCmd": "print(var_dic_list())"
    },
    "r": {
     "delete_cmd_postfix": ") ",
     "delete_cmd_prefix": "rm(",
     "library": "var_list.r",
     "varRefreshCmd": "cat(var_dic_list()) "
    }
   },
   "types_to_exclude": [
    "module",
    "function",
    "builtin_function_or_method",
    "instance",
    "_Feature"
   ],
   "window_display": false
  }
 },
 "nbformat": 4,
 "nbformat_minor": 4
}
